<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <!--响应式标签 meta -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- 引入Bootstrap核心样式文件（必须） -->
    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css">
    <!--通用样式-->
    <link rel="stylesheet" type="text/css" href="css/base.css">
    <!-- 头部样式 -->
    <link rel="stylesheet" href="css/head.css">
    <!-- 首页（index）的样式 -->
    <link rel="stylesheet" href="css/index.css">
    <!--底部下样式-->
    <link rel="stylesheet" href="css/foot.css">
    <!--站点图片-->
    <link href="img/jsjxh02.png" rel="shortcut icon">
    <title>计算机协会官网</title>
    <!--波浪-->
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="js/index.js"></script>
</head>
<body>

<!--****************头部-begin*****************-->
<div id="page1"></div>
<script>
    $("#page1").load("head.html");
</script>
<!--***************头部-end******************-->

<!--****************轮播图-begin*****************-->
<section id="lk_carousel" class="carousel slide" data-ride="carousel">
    <div class=" container ">

    <!-- 轮播（Carousel）指标 -->
        <ol class="carousel-indicators">
            <li data-target="#lk_carousel" data-slide-to="0" class="active"></li>
            <li data-target="#lk_carousel" data-slide-to="1"></li>
            <li data-target="#lk_carousel" data-slide-to="2"></li>
            <li data-target="#lk_carousel" data-slide-to="4"></li>
            <li data-target="#lk_carousel" data-slide-to="5"></li>
        </ol>

    <!-- 轮播（Carousel）项目 -->
        <div class="carousel-inner" role="listbox" >
            <div class="item active">
                <img src="img/jsjxhlbt01.jpg" alt="...">
                <div class="carousel-caption" >学习环境</div>
            </div>
            <div class="item">
                <img src="img/jsjxhlbt02.jpg" alt="...">
                <div class="carousel-caption" >朱总讲话</div>
            </div>
            <div class="item">
                <img src="img/jsjxhlbt03.jpg" alt="...">
                <div class="carousel-caption" >探讨学习</div>
            </div>
            <div class="item">
                <img src="img/jsjxhlbt04.jpg" alt="...">
                <div class="carousel-caption" >互动交流</div>
            </div>
            <div class="item">
                <img src="img/jsjxhlbt05.jpg" alt="...">
                <div class="carousel-caption">合影留念</div>
            </div>

        </div>

    <!-- 轮播（Carousel）导航 -->
        <a class="left carousel-control" href="#lk_carousel" role="button" data-slide="prev">
            <span >《</span>
        </a>
        <a class="right carousel-control" href="#lk_carousel" role="button" data-slide="next">
            <span>》</span>
        </a>

        </div>
</section>
<!--****************轮播图-end******************-->


<!--****************协会简介-begin*****************-->
<section id="lk_Community_profile">
    <div class="lk_dn">
        <img class="lk_dn_1" src="img/dn.png" alt="">
    </div>
    <div class="container ">
        <div class="row">
            <div class="computers col-xs-12 col-sm-12 col-md-4 col-lg-4" >
                <a href="understand.html"><img src="img/jsjxhjj01.jpg" alt=""></a><br>
                <div class="computers_bottom">
                <a href="understand.html">协会简介</a>
                </div>
            </div>
            <div class="computers col-xs-12 col-sm-12 col-md-4 col-lg-4">
                <a href="understand.html"><img src="img/jsjxhjj02.png" alt=""></a><br>
                <div class="computers_bottom">
                <a href="understand.html" >协会文化</a>
                </div>
            </div>
            <div class="computers col-xs-12 col-sm-12 col-md-4 col-lg-4" >
                <a href="understand.html"><img src="img/jsjxhjj03.jpg" alt=""></a><br>
                <div class="computers_bottom">
                <a href="understand.html">办公地点</a>
                </div>
            </div>
            </div>
        </div>
</section>
<!--****************协会简介-end******************-->

<!--****************指导老师-begin*****************-->
<section id="lk_adviser">
    <div class="teacher_top">指导老师</div>
    <div class="container ">
        <div class="row">
            <div class="teacher  col-xs-12 col-sm-6 col-md-6 col-lg-3" style="background-color: lightskyblue">
                <a href="mien.html"><img src="img/zj.png" alt=""></a>
                <div class="teacher_ok">
                <a href="mien.html" class="teacher_name">朱军<br>高级工程师、硕士生导师</a>
                </div>
            </div>
            <div class="teacher  col-xs-12 col-sm-6 col-md-6 col-lg-3" style="background-color: #b2dba1">
                <a href="mien.html"><img src="img/zdls_01.png" alt=""></a>
                <div class="teacher_ok">
                <a href="mien.html" class="teacher_name">xxx<br>xxxxxxxxxxxxxxxx</a>
                </div>
            </div>
            <div class="teacher  col-xs-12 col-sm-6 col-md-6 col-lg-3" style="background-color: #8a6d3b">
                <a href="mien.html"><img src="img/zdls_03.png" alt=""></a>
                <div class="teacher_ok">
                <a href="mien.html" class="teacher_name"> xxx <br>xxxxxxxxxxxxxxxx </a>
                </div>
            </div>
            <div class="teacher  col-xs-12 col-sm-6 col-md-6 col-lg-3" style="background-color: #d43f3a">
                <a href="mien.html"><img src="img/zdls_02.png" alt=""></a>
                <div class="teacher_ok">
                <a href="mien.html" class="teacher_name"> xxx<br>xxxxxxxxxxxxxxxx </a>
                </div>
            </div>
        </div>
    </div>
</section>
<!--****************指导老师-end******************-->

<!--****************展示-begin*****************-->
<section id="lk_show">
    <div class="zl">
        <div class="zl_t">
      <p>展 & 栏</p>
        </div>
    </div>
    <div class="container ">
        <div class="row">
            <div class="zl_l  col-xs-12 col-sm-12 col-md-6 col-lg-4" >
                <div class="zl_whhd">
                    <div class="zl_whhd_z"></div>
                    <a href="#">文化活动</a>
                </div>
                <a href="#"><img src="img/whhd.jpg" alt=""></a>
                <p>程序员日、程序员吐槽大会</p>
            </div>
            <div class="zl_l  col-xs-12 col-sm-12 col-md-6 col-lg-4">
                <div class="zl_whhd">
                    <div class="zl_whhd_z"></div>
                    <a href="#">学术交流</a>
                </div>
                <a href="#"><img src="img/xsjl.png" alt=""></a>
                <p>深入的交流中</p>
            </div>
            <div class="zl_l  col-xs-12 col-sm-12 col-md-6 col-lg-4" >
                <div class="zl_whhd">
                    <div class="zl_whhd_z"></div>
                    <a href="#">合作机构</a>
                </div>
                <a href="#"><img src="img/hzjg.jpg" alt=""></a>
                <p>诚信至上，合作共赢</p>
            </div>
                <div class="zl_l  col-xs-12 col-sm-12 col-md-6 col-lg-6" >
                    <div class="zl_whhd">
                        <div class="zl_whhd_z"></div>
                        <a href="#">办公环境</a>
                    </div>
                    <a href="#"><img src="img/bghj.jpg" alt=""></a>
                    <p>舒适的办公环境</p>
                </div>
                <div class="zl_l  col-xs-12 col-sm-12 col-md-12 col-lg-6" >
                    <div class="zl_whhd">
                        <div class="zl_whhd_z"></div>
                        <a href="#">荣誉展览</a>
                    </div>
                    <a href="#"><img src="img/ryzl_06.jpg "alt=""></a>
                    <p>作品展览与荣誉展览</p>
                </div>
        </div>
    </div>
</section>
<!--****************展示-end******************-->

<!--****************尾部-begin*****************-->
<div id="lk_ending">
    <!-- 底部上 -->
    <div class="top">
        <img  class="yun" src="img/yun.png" alt="">
        <marquee behavior="scroll" direction="right" scrolldelay="130">
        <img src="img/xiaoniao.png" alt="" >
        </marquee>
    </div>
    <div class="top">
        <marquee behavior="scroll" direction="right" scrolldelay="180">
        <img src="img/xiaoniao01.png" alt="" >
        </marquee>
        <marquee behavior="scroll" direction="right" scrolldelay="150">
        <img src="img/xiaoniao02.png" alt="" >
        </marquee>
        <marquee behavior="alternate">
            <img class="jy" src="img/jy.png" alt="" >
        </marquee>
    </div>
    <!-- 波浪底部中 -->
    <div class="wave-box">
        <div class="marquee-box marquee-up" id="marquee-box">
            <!--波浪-->
            <div class="marquee">
                <div class="wave-list-box" id="wave-list-box1">
                    <ul>
                        <li>
                            <img height="60" alt="波浪" src="img/wave_02.png">
                        </li>
                    </ul>
                </div>
                <div class="wave-list-box" id="wave-list-box2">
                    <ul>
                        <li>
                            <img height="60" alt="波浪" src="img/wave_02.png">
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="marquee-box" id="marquee-box3">
            <div class="marquee">
                <div class="wave-list-box" id="wave-list-box4">
                    <ul>
                        <li>
                            <img height="60" alt="波浪" src="img/wave_01.png">
                        </li>
                    </ul>
                </div>
                <div class="wave-list-box" id="wave-list-box5">
                    <ul>
                        <li>
                            <img height="60" alt="波浪" src="img/wave_01.png">
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--底部下-->
    <div class="bottom">
        <div class="container">
            <div class="row">
                <div class=" col-lg-3">
                    <div class="row">
                        <ul class="col-lg-6">
                            <p>合作伙伴</p>
                            <li><a href="#">合作社团</a></li>
                            <li><a href="#">合作高校</a></li>
                            <li><a href="#">合作企业</a></li>

                        </ul>
                        <ul class="col-lg-6">
                            <p>意见反馈</p>
                            <li><a href="#">发现问题</a></li>
                            <li><a href="#">给予建议</a></li>
                            <li><a href="#">给予评价</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-3">
                    <ul class="col-lg-6">
                        <p>加入我们</p>
                        <li style="margin-bottom: 10px"><a href="register.html"><img src="img/dl.png" style="width: 25px;height: 25px">  登录</a></li>
                        <li><a href="logout.html"><img src="img/zx.png" style="width: 24px;height: 24px">   注销</a></li>
                    </ul>
                </div>
                <div class="col-lg-3"></div>
                <div class="attention col-lg-3">
                    <P>关注我们</P>
                    <a href="#"><img src="img/wx.png" alt=""></a>微信
                    <a href="#"><img src="img/QQ.png" alt=""></a>QQ
                    <a href="#"><img src="img/dy.png" alt=""></a>抖音
                </div>
            </div>
        </div>
    </div>
    <!--***************尾部-end******************-->

    <!--**************底部**************-->
    <div id="page2"></div>
    <script>
        $("#page2").load("foot.html");
    </script>
    <!--**************底部**************-->
</div>
<script src="lib/jquery/jquery.js"></script>
<!-- 引入所有的Bootstrap的JS插件 -->
<script src="lib/bootstrap/js/bootstrap.js"></script>
</body>
</html>